<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <!--<meta name="viewport" content="width=device-width, initial-scale=1.0 user-scalable=no">-->
    <meta name="format-detection" content="telephone=no" />
    <title>沟通中</title>
    <link rel="stylesheet" type="text/css" href="{{ URL::asset('/Style/home/chart/css/themes.css?v=2017129') }}">
    <link rel="stylesheet" type="text/css" href="{{ URL::asset('/Style/home/chart/css/h5app.css') }}">
    <link rel="stylesheet" type="text/css" href="{{ URL::asset('/Style/home/chart/fonts/iconfont.css?v=2016070717') }}">
    <link rel="stylesheet" type="text/css" href="{{ URL::asset('/Style/home/chart/css/chat_list.css') }}">
    <script src="{{ URL::asset('/Style/home/chart/js/jquery.min2.js') }}"></script>
    <script src="{{ URL::asset('/Style/home/chart/js/dist/flexible/flexible_css.debug.js') }}"></script>
    <script src="{{ URL::asset('/Style/home/chart/js/dist/flexible/flexible.debug.js') }}"></script>

</head>
<body>
<div class='fui-page-group'>
    <div class="fui-statusbar"></div>
    <div class='fui-page chat-page'>
        <div class="fui-header">
            <div class="title">消息列表</div>
            <div class="fui-header-right"></div>
        </div>

        <div class="fui-content navbar chat-fui-content" style="padding-bottom: 2rem;">
{{--            <div class="chat-list flex" >--}}
{{--                <div class="chat-img"  style="background-image: url('http://www.hwqugou.cn/img/555.jpg')">--}}
{{--                    <span class="badge" style="top: -0.1rem;left: 80%;">1</span>--}}
{{--                </div>--}}
{{--                <div class="chat-info">--}}
{{--                    <p class="chat-merch flex">--}}
{{--                        <span class="title t-28">魔力克</span>--}}
{{--                        <span class="time">2017-12-14</span>--}}
{{--                    </p>--}}
{{--                    <p class="chat-text singleflow-ellipsis">你好</p>--}}
{{--                </div>--}}
{{--            </div>--}}
        </div>
    </div>
</div>
</body>
<script>

    var fromid ={{$fromid}};

    ws =  new WebSocket("ws://127.0.0.1:8282");
    ws.onmessage=function(e){
        var message = eval("("+ e.data+")");

        switch (message.type){
            case  "init":
                var bild = '{"type":"bind","fromid":"'+fromid+'"}';
                ws.send(bild);
                list();
                return;
            case "text":
                $(".chat-fui-content").html("");
                list();
                return;
            case "say_img":
                $(".chat-fui-content").html("");
                list();
                return;

        }
    }

    function list(){
        $.ajax({
            headers: { 'X-CSRF-TOKEN' : '{{csrf_token()}}'},
            type:"POST",// get或者post
            url: "/chatList/get_list",// 请求的url地址
            data:{'id':fromid},
            success:function(data){
                $.each(data,function(index,content){
                    if(content.countNoread==0){
                        $(".chat-fui-content").append('<div onclick=redi("'+content.chat_page+'") class="chat-list flex" ><div class="chat-img"  style="background-image: url('+content.head_url+')"></div> <div class="chat-info"> <p class="chat-merch flex"> <span class="title t-28">'+content.username+'</span> <span class="time">'+mydate(content.last_message.time)+'</span> </p> <p class="chat-text singleflow-ellipsis">'+content.last_message.content+'</p> </div></div>');
                    }else{
                        $(".chat-fui-content").append('<div onclick=redi("'+content.chat_page+'") class="chat-list flex" ><div class="chat-img"  style="background-image: url('+content.head_url+')"> <span class="badge" style="top: -0.1rem;left: 80%;">'+content.countNoread+'</span> </div> <div class="chat-info"> <p class="chat-merch flex"> <span class="title t-28">'+content.username+'</span> <span class="time">'+mydate(content.last_message.time)+'</span> </p> <p class="chat-text singleflow-ellipsis">'+content.last_message.content+'</p> </div></div>');
                    }
                })
            },
        });
    }



    /**
     *根据时间戳格式化为日期形式
     */
    function mydate(nS){
        return new Date(parseInt(nS) * 1000).toLocaleString().replace(/年|月/g, "-").replace(/日/g, " ");
    }
    function redi(url){
        window.location.href=url;
    }

</script>

</html>
